<template>
	<view class="bg-img">
	  <view v-if="isLogin">
		  <view class="history">
			  <view>
				  <van-row>
				    <van-col span="8">
						<image :src=totalHistory.avatar mode="aspectFit" class="avatar"></image>
						<uni-icons type="refreshempty" size="30" color="white" @click="refweb()"></uni-icons>
						<view class="nickname">{{totalHistory.nickName}}</view>
					</van-col>
				    <van-col span="14">
					  <view class="body">
						  <view>
							  <span class="title">今日记录：</span>
								<span :style="{color:totalHistory.todayTrue >0?'#99ff00':'white'}">{{totalHistory.todayTrue}}</span>
								/<span :style="{color:totalHistory.todayErr >0?'#ff0000':'white'}">{{totalHistory.todayErr}}</span>
						  </view>
						  <view>
							  <span class="title">昨日记录：</span>
							  <span :style="{color:totalHistory.yestTrue >0?'#99ff00':'white'}">{{totalHistory.yestTrue}}</span>/
							  <span :style="{color:totalHistory.yestErr >0?'#ff0000':'white'}">{{totalHistory.yestErr}}</span>
						</view>
						  <view>
							  <span class="title">30天记录：</span>
							  <span :style="{color:totalHistory.monthTrue >0?'#99ff00':'white'}">{{totalHistory.monthTrue}}</span>
							  /<span :style="{color:totalHistory.monthErr >0?'#ff0000':'white'}">{{totalHistory.monthErr}}</span>
						 </view>
					</view>
					</van-col>
				  </van-row>
			  </view>

		  </view>
		  <!-- 建议列表 -->
		  <view class="uni-cow">
				<van-row >
					<van-col span="6" class="uni-col">题目</van-col>
					<van-col span="4" class="uni-col">答案</van-col>
					<van-col span="14" class="uni-col">时间</van-col>
			  </van-row>
		  </view>
		
		   <mescroll-body ref="mescrollRef" @init="mescrollInit":down="downOption" @down="downCallback" :up="upOption" @up="upCallback">
		  <view v-for="(item,index) in dataList" :key="index" class="uni-tables">
		  	<view class="tables" :style="{color:item.statu ==0?'red':'black'}">
		  		<van-row>
		  		  <van-col span="6" class="uni-col">{{item.title}}</van-col>
				  <van-col span="4" class="uni-col">{{item.result}}</van-col>
		  		  <van-col span="14" class="uni-col">{{item.time}}</van-col>
		  		</van-row>
		  	</view>
		  </view>
		  </mescroll-body>
	  </view>
	  <view v-else>
		  <view class="msg">登陆后开启</view>
		  <button type="default" @tap="gototab()" size="mini" class="btn">登录</button>
		  <!-- <view class="">流广告</view> -->
	  </view>
  </view>
</template>

<script>
	import {historyTotal,historyList} from '@/api/work/study.js'
	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
  export default {
	  mixins: [MescrollMixin], // 使用mixin
    data() {
      return {
		  downOption:{
		  	autoShowLoading: true, // 显示下拉刷新的进度条
		  	textColor: "#FF8095" // 下拉刷新的文本颜色
		  },	
		  upOption:{
		  	auto: false,
		  	page:{
		  		num:1,
		  		size:10
		  	}
		  },
		  queryParams: {
		    pageNum: 1,
		    pageSize: 20
		  },
		isLogin: false,
		totalHistory:'',
		dataList:'',
      }
    },
	onLoad() {
		var t =  uni.getStorageSync("App-Token")
		if(t){
			this.isLogin = true
			this.getHisttory()
		}
	},
    methods: {
		refweb(){
			console.log("aaaa")
			uni.redirectTo({
				url:'/pages/work/index'
			})
		},
		downCallback() {
			this.queryParams={
				pageNum: 1,
				pageSize: 20
				}
				historyList(this.queryParams.pageNum,this.queryParams.pageSize).then(resp=>{
					this.dataList = resp.rows
					this.mescroll.endSuccess(resp.rows.length);
				})
			},
			upCallback() {
				historyList(this.queryParams.pageNum,this.queryParams.pageSize).then(resp=>{
					if(resp.code =='200'){
						this.dataList = [...this.dataList,...resp.rows]
						this.mescroll.endByPage(resp.rows.length, resp.total);
						if(resp.rows.length == this.queryParams.pageSize){
							this.queryParams.pageNum++
							}else{
								this.mescroll.endSuccess();
							}
					}

				})
			},
		getHisttory(){
			 historyTotal().then(resp=>{
				this.totalHistory = resp.data
			})
		},
		gototab(){
			uni.navigateTo({
				url:'/pages/login'
			})
		},
    }
  }
</script>

<style lang="scss">
	.bg-img{
		margin-top: 30rpx;
	}
	.history {
		border: 1px solid cadetblue;
		margin: 20rpx;
		background-color: cadetblue;
		border-radius: 30rpx;
		padding: 10rpx;
		color: white;
		font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
	}
 .msg{
	 font-size: large;
	 text-align: center;
	 color: lightseagreen;
	 margin: 10rpx;
 }
 .btn{
	 margin-left: 40%;
 }
 .avatar {
	height: 100rpx;
	
 }
 .nickname {
	 text-align: center;
 }
 .body{
	 text-align: center;
 }
 .title{
	 margin: 5rpx;
	 margin-right: 50rpx;
	 
 }
 .tables {
	 background-color: #E0EEEE;
 }
</style>
